<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			/* css样式思路：
			 1.通配选择器：微软雅黑 #f5f5f5 浅灰 外边距到0
			 2.#product_card：内边距、外边距、阴影【透明度.1】、文字居中
			 3.img：边框倒角、内外边距？【微调】
			 4.h3:颜色、内外边距？【微调】
			 5.p:字体大小颜色
			 6.p+span:span、内外边距？【微调】
			 */
			div{
				width: 1000px;
				height: 1000px;
				background: #f5f5f5;
			}
			#product_card img{
				background:white;
				border: 1px solid #a2a2a2;
				padding: 15px 15px 150px 15px;
				box-shadow: 1px 1px 3px 1px #a2a2a2;
				margin: 200px 200px 200px 210px;
			}
			#product_card h3{
				margin: -340px 300px;
				
			}
			#product_card p{
				color: red;
				margin: 370px 290px;
			}
			#product_card #p1{
				
				color: #959490;
				margin: -350px 290px;
				
				
			}
		</style>
	</head>
	<body>
		<!-- 网页：1.html结构【原生图分析】 -->
		<div id="product_card">
			<img src="img/12.jpg" width="240px" height="350px" alt="小米SU7">
			<h3>小米SU7</h3>
			<p>￥279999.00</p>
			<p id="p1">已有 <span>10万+ </span>人评价</p>
		</div>
	</body>
</html>